/**
 * 手工添加发票按钮
 */
import React, { Component } from "react";
import { messages } from "share/common";
import { Button, Dropdown, Icon, Menu } from "antd";
import expenseService from "../expense.service";
import "styles/my-account/components/button-add-invoice.scss";

class ButtonAddInvoice extends Component {

  state = {
    types: [],
  };

  componentDidMount() {
    this.getTypes();
  }

  getTypes = () => {
    expenseService.getInvoiceTypeList(this.props.userOID)
      .then(res => this.setState({ types: res.data.rows }))
  };

  render() {
    const { types } = this.state;
    const menuItem = types.map(item =>
      <Menu.Item key={item.value}>
        {item.messageKey}{item.remark ? `(${item.remark})` : ''}
      </Menu.Item>
    );
    return (
      <Dropdown
        overlay={<Menu onClick={e => this.props.onSelect(e.key)}>{menuItem}</Menu>}
        overlayClassName="button-add-invoice-dropdown"
      >
        <Button>
          {messages('expense-1.key46')/*录发票*/} <Icon type="down"/>
        </Button>
      </Dropdown>
    );
  }
}

export default ButtonAddInvoice;
